<template>
  <div :class="tbButtonCls">
    <TButton v-bind="$attrs" @propClick="dialogBtnClick" />
  </div>
</template>

<script>

import TButton from '@/components/basic/TButton.vue'
export default {
    name: 'PButton',
    components: {
      TButton
    },
    props: {
        type: {
            type: String,
            required: true
        }
    },
    data() {
        return {
            tbButtonClass: {
                center: 'tbButtonCenter',
                left: 'tbButtonLeft',
                right: 'tbButtonRight'
            }
        }
    },
    computed: {
        tbButtonCls() {
            return this.tbButtonClass[this.type]
        }
    },
    methods: {
        dialogBtnClick(fun) {
            this.$emit('propClick', fun)
        }
    }
}
</script>

<style lang="scss" scoped>
.tbButtonCenter {
    text-align: center;
    padding: 20px 0px;
}
.tbButtonLeft {
    text-align: left;
    padding: 20px 0px;
}
.tbButtonRight {
    text-align: right;
    padding: 20px 0px;
}
</style>
